<template>
	<view>
		<view class="index-bg">
			<image style="width:100%;height:100%;" :src="xasaGlob.backgroundImage" mode="scaleToFill"></image>
		</view>
		<page-nav :title="xasaGlob.appName" :subtitle="xasaGlob.appAlias"></page-nav>
		<view class="u-page">
			<unicloud-db ref="udb" 
			v-slot:default="{data, pagination, loading, hasMore, error}" 
			:collection="collection"
				:where="where" orderby="sort" @load="handleLoad">
				<view v-if="error">{{error.message}}</view>
				<template v-else-if="data">
					<view class="btn-list">
						<button data-eventsync="true" type="primary"
						 v-for="(item, index) in data" :key="index"
							@click="openPageOrMP(item)">{{item.name}}</button>
					</view>
				</template>
			</unicloud-db>
			<view style="display:flex;justify-content:space-around;margin-top:100px;color:#333;font-size: 12px;">
			<text>Copyright© 2024 兴安盟市场监督管理局</text> 
			</view>
		</view>
	</view>
	<!-- <xasa-foot></xasa-foot> -->
	<up-loading-page loading-color="#00cccc" loading-mode="spinner" bg-color="rgba(255, 255, 255, 0.8)"
		:loading="!isReady" icon-size="72" loading-text="loading..."></up-loading-page>
</template>
<script>
	import handleMenu from '@/common/handleMenu.js';
	import {
		getXasaGlob
	} from '@/js_sdk/xasaGlobData.js'
	const db = uniCloud.databaseForJQL();

	export default {
		data() {
			return {
				xasaGlob: {
					appName: '',
					appAlias: '',
					cloudDownDomain: '',
					backgroundImage:'https://env-00jxt1y6e6me.normal.cloudstatic.cn/xasa/indexbg.jpg'
				},
				collection: 'xasa-index-menus',
				where: 'enable==true', // 查询条件，用于控制页面显示的内容。
				isReady: false, // 是否正在加载中
				indexStyle: ''// 页面样式，用于控制页面布局和样式。
			}
		},
		methods: {
			handleLoad(data, ended, pagination) {
				// `data` 当前查询结果
				// `ended` 是否有更多数据
				// `pagination` 分页信息 HBuilderX 3.1.5+ 支持
				//console.log("data:",data);
			},
			openPageOrMP(menu) {
				handleMenu(menu)
			},
			toPage(url) {
				uni.navigateTo({
					url: url
				})
			},
			toMiniProgram(appId) {
				// #ifdef MP
				uni.navigateToMiniProgram({
					appId: appId
				})
				// #endif
			}
		},
		async onLoad() {
			//let t=JSON.parse(process.env.UNI_CLOUD_PROVIDER)
			//console.log(t)
			let that=this;
			let cloudDownDomain = await getXasaGlob('cloudDownDomain');
			let appName = await getXasaGlob('appName');
			let appAlias = await getXasaGlob('appAlias');
			let backgroundImage=await getXasaGlob('backgroundImage');
			this.xasaGlob = {
				appName: appName,
				appAlias: appAlias,
				cloudDownDomain: cloudDownDomain,
				backgroundImage:cloudDownDomain+backgroundImage
			}
			//let s = `${cloudDownDomain}/xasa/indexbg.jpg`; // 获取图片地址。
			if(backgroundImage) this.indexStyle = `background-image: url(${backgroundImage})`;
/* 			uni.getImageInfo({
				src:s, // 图片地址。
                success: (res)=>{
					this.indexStyle = `background-image: url(${s})`;
                }
			}) */
			this.isReady = true;
			// #ifdef MP
			this.mpShare.title = appName;
			// #endif
		},
		onShareTimeline() {
			return this.mpShare;
		},
		onShow() {},
		onReady() {
			//console.log('onReady process.env',process.env);
		}
	}
</script>
<style lang="scss">
	@import '@/common/css/uni-ui.scss';
	
	.index-bg {
		width: 100vw;
		position: fixed;
		top:0;
		left: 0;
		bottom: 0;
		right:0;
		background-color: #f3f4f6;
		z-index: -1;

		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
		/* background-attachment: fixed; */
/* 		height: 100vh; */
		
	}

	.content {
		padding-bottom: 30px;
	}

	.title {
		font-weight: bold;
		text-align: center;
		padding: 20px 0px;
		font-size: 20px;
	}

	.tips {
		color: #999999;
		font-size: 14px;
		padding: 20px 30px;
	}

	.btn-list {
		padding: 0px 30px;
	}

	.btn-list button {
		margin-bottom: 20px;
	}

	.upload-preview {
		width: 100%;
	}
</style>